<template>
  <div v-show="empty" class="empty">
    <p>————暂时没有数据————</p>
  </div>
</template>

<script>
export default {
  name: 'Empty',
  props: {
    isEmpty: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
      empty: false
    }
  },
  watch: {
    isEmpty: {
      handler: function (status) {
        this.empty = status
      },
      immediate: true
    }
  },
  created () {
    this.empty = this.isEmpty
  }
}
</script>

<style lang="stylus" scoped>
@import '~stylus/mixins.styl'
@import '~stylus/variable.styl'

.empty
  width 100%
  height 300px
  display flex
  justify-content center
  align-items center
  font-size $home_size
  color $home_font_color
</style>
